<ul class="media-list">
    <li class="media">
        <a class="pull-left" href="#">
            <img class="media-object" src="//www.placehold.it/64x64" alt="media-object">
        </a>
        <div class="media-body">
            <h4 class="media-heading">Media heading</h4>
            <p>Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras
                purus odio, vestibulum in vulputate at, tempus viverra turpis.</p>
            <div class="media">
                <a class="pull-left" href="#">
                    <img class="media-object" src="//www.placehold.it/64x64" alt="media-object">
                </a>
                <div class="media-body">
                    <h4 class="media-heading">Nested media heading</h4>
                    Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo.
                    Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
                    <div class="media">
                        <a class="pull-left" href="#">
                            <img class="media-object" src="//www.placehold.it/64x64" alt="media-object">
                        </a>
                        <div class="media-body">
                            <h4 class="media-heading">Nested media heading</h4>
                            Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin
                            commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
                        </div>
                    </div>
                </div>
            </div>
            <div class="media">
                <a class="pull-left" href="#">
                    <img class="media-object" src="//www.placehold.it/64x64" alt="media-object">
                </a>
                <div class="media-body">
                    <h4 class="media-heading">Nested media heading</h4>
                    Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo.
                    Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
                </div>
            </div>
        </div>
    </li>
    <li class="media">
        <a class="pull-right" href="#">
            <img class="media-object" src="//www.placehold.it/64x64" alt="media-object">
        </a>
        <div class="media-body">
            <h4 class="media-heading">Media heading</h4>
            Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras
            purus odio, vestibulum in vulputate at, tempus viverra turpis.
        </div>
    </li>
</ul>